/* jshint esversion: 6 */
import React from 'react';
import { Link, Redirect, useHistory, useLocation } from 'react-router-dom';

import Input from '@iso/components/uielements/input';
import Button from '@iso/components/uielements/button';


import authAction from '@iso/redux/auth/actions';
import appAction from '@iso/redux/app/actions';

import SignInStyleWrapper from './SignIn.styles';

import axios from '../../../http';
import Qs from 'qs';
import cookie from 'react-cookies';

import message from '@iso/components/Feedback/Message';



import {createBrowserHistory, createHashHistory} from "history";
import MessageContent from "../../Feedback/Message/Message.styles";
const { login } = authAction;
const { clearMenu } = appAction;

export default class SignIn extends React.Component{

  constructor(props) {
    super(props);
    this.state = {username:'',password:''};
    this.handleLogin=this.handleLogin.bind(this);
    this.handleUsernameChange=this.handleUsernameChange.bind(this);
    this.handlePasswordChange=this.handlePasswordChange.bind(this);
  }

   handleLogin=() =>{
    axios.post('api/auth/oauth/token?grant_type=password', Qs.stringify({
         username: this.state.username,
         password: this.state.password
     }), {headers: {'Content-Type': 'application/x-www-form-urlencoded'}})
         .then( (response)=>{
             let  data=response.data
             if(data.access_token!=undefined){
                 cookie.save('access_token',data.access_token);
                 let history = createHashHistory()
                 history.push({
                     pathname: "/main"
                 });
                 history.go();
             }else {

                 let messageDic={};
                 messageDic["Bad credentials"]="用户名或密码错误";
                 messageDic["User account is locked"]="用户被锁定，请联系管理员解锁。";
                 messageDic["Maximum sessions of 1 for this principal exceeded"]="该用户已在别处登录，请先退出后再登录，或联系管理员踢除已登录账户。";
                 messageDic["User credentials have expired"]="密码已过期。";
                 messageDic["User account has expired"]="账号已过期。";

                 this.showErrorMessage(messageDic[data.error_description]);
             }
         }).catch(function (error) {
          this.showErrorMessage(error);
       });

  }

    showErrorMessage(systemMessage){
        message.error(
            <MessageContent>
                {systemMessage}
            </MessageContent>,
            5
        );
    };

   handleUsernameChange=(e)=>{
    this.setState({
      username:e.target.value
    })
  }
   handlePasswordChange=(e)=>{
    this.setState({
      password:e.target.value
    })

  }
render(){
  return (
      <SignInStyleWrapper className="isoSignInPage">
        <div className="isoLoginContentWrapper">
          <div className="isoLoginContent">
            <div className="isoLogoWrapper">
              <Link to="/">
                  用户登录
              </Link>
            </div>
            <div className="isoSignInForm">
              <form>
                <div className="isoInputWrapper">
                  <Input
                      size="large"
                      placeholder="用户名"
                      onChange={this.handleUsernameChange.bind(this)}
                      autoComplete="true"
                  />
                </div>

                <div className="isoInputWrapper">
                  <Input
                      size="large"
                      type="password"
                      onChange={this.handlePasswordChange.bind(this)}
                      placeholder="密码"
                      autoComplete="false"
                  />
                </div>

                <div className="isoInputWrapper isoLeftRightComponent">

                  <Button type="primary" onClick={this.handleLogin}>
                      登录
                  </Button>
                </div>


              </form>


            </div>
          </div>
        </div>
      </SignInStyleWrapper>
  );
 };
}
